<style type="text/css">
    .spuBox{
        display: inline-block;
    }
    .actionBox{
        padding: 7px 15px 0;
    }
    .actionBox .add{
        color: #18bc9c;
    }
    .actionBox .del{
        color: #f75444;
        margin-right: 20px;
    }
    .spuLine{
        background: #f4f4f4;
        padding: 10px 0;
        margin: 10px 0;
        clear: both;
    }
    .tableBox{
        margin-top: 20px;
        clear: both;
    }
    .skuLine{
        clear: both;
        margin-top: 10px;
    }
</style>
<form id="edit-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">
     <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Shop_id')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-shop_id" data-rule="required" min="0" data-source="service/shop/shop/index" disabled="true" class="form-control selectpage" name="row[shop_id]" type="text" value="{$row.shop_id|htmlentities}">
        </div>
    </div>
    <div id="app">
        <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Name')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-name" data-rule="required" class="form-control" name="row[name]" type="text" value="{$row.name|htmlentities}">
        </div>
    </div>

    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('To_shop')}:</label>
        <div class="col-xs-12 col-sm-8">
                        
            <select  id="c-to_shop" class="form-control selectpicker" multiple="" name="row[to_shop][]">
                {foreach name="toShopList" item="vo"}
                    <option value="{$key}" {in name="key" value="$row.to_shop"}selected{/in}>{$vo}</option>
                {/foreach}
            </select>

        </div>
    </div>
    <div class="form-group">
            
                <label class="control-label col-xs-12 col-sm-2">分类:</label>

            
<div class="form-inline col-xs-12 col-sm-4" data-toggle="cxselect" data-selects="first,second">
<select class="first form-control" data-rule="required" name="row[category_id]" data-url="service/goods/category" >
    <option value="{$row.category_id|htmlentities}" selected=""></option>
</select>
<select class="second form-control" data-rule="required" name="row[two_category_id]" data-url="service/goods/category" data-query-name="pid">
    <option value="{$row.two_category_id|htmlentities}" selected=""></option>
</select>
</div>
            
        </div>

        
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Skill_cate_ids')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-skill_cate_ids" data-rule="required" min="0" data-source="service/skill/skillcate/index" data-multiple="true" class="form-control selectpage" name="row[skill_cate_ids]" type="text" value="{$row.skill_cate_ids|htmlentities}">
        </div>
    </div>
    <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">{:__('Tag_name')}:</label>
            <div class="col-xs-12 col-sm-8">
                <input id="c-tag_name" data-rule="required" class="form-control" name="row[tag_name]" value="{$row.tag_name|htmlentities}" type="text" placeholder="标签用 | 符合间隔">
            </div>
            <!--<div ><span>标签用 | 符合间隔</span></div>-->
        </div>
       
        
        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">{:__('Choose_skill_type')}:</label>
            <div class="col-xs-12 col-sm-8">
                <div class="radio">
                    {foreach name="chooseSkillTypeList" item="vo"}
                    <label for="row[choose_skill_type]-{$key}"><input id="row[choose_skill_type]-{$key}" name="row[choose_skill_type]" v-model="choose_skill_type" type="radio" value="{$key}" {in name="key" value="$row.choose_skill_type"}checked{/in} /> {$vo}</label>
                    {/foreach}
                </div>
                
               

            </div>
        </div>
        <div class="form-group" v-show="choose_skill_type == 1">
            <label class="control-label col-xs-12 col-sm-2">{:__('Is_travel')}:</label>
            <div class="col-xs-12 col-sm-8">
                <div class="radio">
                    {foreach name="isTravelList" item="vo"}
                    <label for="row[is_travel]-{$key}"><input id="row[is_travel]-{$key}" name="row[is_travel]"  type="radio" value="{$key}" {in name="key" value="$row.is_travel"}checked{/in} /> {$vo}</label>
                    {/foreach}
                </div>
                
               

            </div>
        </div>

    <!--<div class="form-group">-->
    <!--    <label class="control-label col-xs-12 col-sm-2">{:__('Type')}:</label>-->
    <!--    <div class="col-xs-12 col-sm-8">-->
                        
    <!--        <select  id="c-type" data-rule="required" class="form-control selectpicker" name="row[type]">-->
    <!--            {foreach name="typeList" item="vo"}-->
    <!--                <option value="{$key}" {in name="key" value="$row.type"}selected{/in}>{$vo}</option>-->
    <!--            {/foreach}-->
    <!--        </select>-->

    <!--    </div>-->
    <!--</div>-->
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Image')}:</label>
        <div class="col-xs-12 col-sm-8">
            <div class="input-group">
                <input id="c-image" data-rule="required" class="form-control" size="50" name="row[image]" type="text" value="{$row.image|htmlentities}">
                <div class="input-group-addon no-border no-padding">
                    <span><button type="button" id="faupload-image" class="btn btn-danger faupload" data-input-id="c-image" data-mimetype="image/gif,image/jpeg,image/png,image/jpg,image/bmp,image/webp" data-multiple="false" data-preview-id="p-image"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
                    <span><button type="button" id="fachoose-image" class="btn btn-primary fachoose" data-input-id="c-image" data-mimetype="image/*" data-multiple="false"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
                </div>
                <span class="msg-box n-right" for="c-image"></span>
            </div>
            <ul class="row list-inline faupload-preview" id="p-image"></ul>
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Images')}:</label>
        <div class="col-xs-12 col-sm-8">
            <div class="input-group">
                <input id="c-images" data-rule="required" class="form-control" size="50" name="row[images]" type="text" value="{$row.images|htmlentities}">
                <div class="input-group-addon no-border no-padding">
                    <span><button type="button" id="faupload-images" class="btn btn-danger faupload" data-input-id="c-images" data-mimetype="image/gif,image/jpeg,image/png,image/jpg,image/bmp,image/webp" data-multiple="true" data-preview-id="p-images"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
                    <span><button type="button" id="fachoose-images" class="btn btn-primary fachoose" data-input-id="c-images" data-mimetype="image/*" data-multiple="true"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
                </div>
                <span class="msg-box n-right" for="c-images"></span>
            </div>
            <ul class="row list-inline faupload-preview" id="p-images"></ul>
        </div>
    </div>

    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Response_hour')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-response_hour" data-rule="required" min="0" class="form-control" name="row[response_hour]" type="number" value="{$row.response_hour|htmlentities}">
        </div>
    </div>

    <div class="form-group" v-show="choose_skill_type == 0">
        <label class="control-label col-xs-12 col-sm-2">{:__('Start_hour')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-start_hour" min="0" class="form-control"  name="row[start_hour]" type="number" value="{$row.start_hour|htmlentities}">
        </div>
    </div>
    <div class="form-group" v-show="choose_skill_type == 0">
        <label class="control-label col-xs-12 col-sm-2">{:__('End_hour')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-end_hour" min="0" class="form-control"  name="row[end_hour]" type="number" value="{$row.end_hour|htmlentities}">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('City')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-city" class="form-control" name="row[city]" data-toggle="city-picker"  type="text" value="{$row.city|htmlentities}" data-level="city">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Spec_type')}:</label>
        <div class="col-xs-12 col-sm-8">
                        
         
            
             
                <div class="radio">
                    {foreach name="specTypeList" item="vo"}
                    <label for="row[spec_type]-{$key}"><input id="row[spec_type]-{$key}" name="row[spec_type]"  type="radio" v-model="spec_type" value="{$key}" {in name="key" value="spec_type"}checked{/in} /> {$vo}</label>
                    {/foreach}
                </div>

        </div>
    </div>
        <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Price')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-price" data-rule="required" min="0" class="form-control" step="0.01" name="row[price]" type="number" value="{$row.price|htmlentities}">
        </div>
    </div>
        <div class="form-group" v-if="spec_type == 0">
            <label class="control-label col-xs-12 col-sm-2">{:__('Cost_seconds')}:</label>
            <div class="col-xs-12 col-sm-8">
                <input id="c-cost_seconds" data-rule="required" min="0" class="form-control" step="1" name="row[cost_seconds]" type="number" value="{$row.cost_seconds|htmlentities}" placeholder="请输入时长（分钟）">
            </div>
        </div>
        <div class="form-group"   v-if="spec_type == 1">
            <label class="control-label col-xs-12 col-sm-2"></label>
                <div class="col-xs-12 col-sm-8 ">
                    <input  class="hidden" :value="JSON.stringify(spu)" name="row[spu]"  type="text">
                    
                    <input  class="hidden" :value="JSON.stringify(sku)" name="row[sku]"  type="text">
                    <template v-for="(item, index) of spu">
                        <div class="spuLine">
                           <label class="control-label col-xs-12 col-sm-3">规格名称:</label>
                            <div class="spuBox col-xs-12 col-sm-5">
                                <input  data-rule="required" class="form-control" size="50" v-model="item.name"  type="text" placeholder="请输入规格名称">
                            </div>
    
                            <div class="actionBox">
                                <span class="del" v-if="spu.length > 1" @click="delSpuName(index)">删除</span>
                                <span class="add"  @click="addSpuName">增加</span>
                            </div>
                        </div>
                        <div class="skuLine" v-for="(val,key) of item.info">
                            <label class="control-label col-xs-12 col-sm-3">{{key === 0 ? '规格值': ''}}</label>
                            <div class="spuBox col-xs-12 col-sm-5">
                                <input  data-rule="required" class="form-control" size="50" v-model="val.name"  type="text" placeholder="请输入规格值">
                            </div>
    
                            <div class="actionBox">
                                <span class="del" v-if="item.info.length > 1" @click="delSkuName(key,item.info)">删除</span>
                                <span class="add"  @click="addSkuName(item.info)">增加</span>
                            </div>
                        </div>
                    </template>
    
                    <div class="tableBox">
                        <table  class="table table-striped table-bordered table-hover table-nowrap">
                            <thead>
                                <tr>
                                    <th v-for="item of spu">{{item.name}}</th>
                                    <th >时长</th>
                                    <th >价格</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr v-for="item of sku">
                                    <td v-for="value of item.name.split(',')">{{value}}</th>
                                    <td >
                                        <input  data-rule="required" class="form-control"  size="50" v-model="item.cost_seconds" type="number" placeholder="请输入时长（分钟）">
                                    </td>
                                    <td >
                                        <input  data-rule="required" class="form-control"  size="50" v-model="item.price" type="number" placeholder="请输入价格">
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
    
                </div>
        </div> 
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Flow_path_images')}:</label>
        <div class="col-xs-12 col-sm-8">
            <div class="input-group">
                <input id="c-flow_path_images" data-rule="required" class="form-control" size="50" name="row[flow_path_images]" type="text" value="{$row.flow_path_images|htmlentities}">
                <div class="input-group-addon no-border no-padding">
                    <span><button type="button" id="faupload-flow_path_images" class="btn btn-danger faupload" data-input-id="c-flow_path_images" data-mimetype="image/gif,image/jpeg,image/png,image/jpg,image/bmp,image/webp" data-multiple="true" data-preview-id="p-flow_path_images"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
                    <span><button type="button" id="fachoose-flow_path_images" class="btn btn-primary fachoose" data-input-id="c-flow_path_images" data-mimetype="image/*" data-multiple="true"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
                </div>
                <span class="msg-box n-right" for="c-flow_path_images"></span>
            </div>
            <ul class="row list-inline faupload-preview" id="p-flow_path_images"></ul>
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Illustrate_images')}:</label>
        <div class="col-xs-12 col-sm-8">
            <div class="input-group">
                <input id="c-illustrate_images" data-rule="required" class="form-control" size="50" name="row[illustrate_images]" type="text" value="{$row.illustrate_images|htmlentities}">
                <div class="input-group-addon no-border no-padding">
                    <span><button type="button" id="faupload-illustrate_images" class="btn btn-danger faupload" data-input-id="c-illustrate_images" data-mimetype="image/gif,image/jpeg,image/png,image/jpg,image/bmp,image/webp" data-multiple="true" data-preview-id="p-illustrate_images"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
                    <span><button type="button" id="fachoose-illustrate_images" class="btn btn-primary fachoose" data-input-id="c-illustrate_images" data-mimetype="image/*" data-multiple="true"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
                </div>
                <span class="msg-box n-right" for="c-illustrate_images"></span>
            </div>
            <ul class="row list-inline faupload-preview" id="p-illustrate_images"></ul>
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Salenums')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-salenums" data-rule="required" min="0" class="form-control" name="row[salenums]" type="number" value="{$row.salenums|htmlentities}">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Shop_state')}:</label>
        <div class="col-xs-12 col-sm-8">
            
            <div class="radio">
            {foreach name="shopStateList" item="vo"}
            <label for="row[shop_state]-{$key}"><input id="row[shop_state]-{$key}" name="row[shop_state]" type="radio" value="{$key}" {in name="key" value="$row.shop_state"}checked{/in} /> {$vo}</label> 
            {/foreach}
            </div>

        </div>
    </div>
    
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Status')}:</label>
        <div class="col-xs-12 col-sm-8">
            
            <div class="radio">
            {foreach name="statusList" item="vo"}
            <label for="row[status]-{$key}"><input id="row[status]-{$key}" name="row[status]" type="radio" value="{$key}" {in name="key" value="$row.status"}checked{/in} /> {$vo}</label> 
            {/foreach}
            </div>

        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Note')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-note" class="form-control" name="row[note]" type="text" value="{$row.note|htmlentities}">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Weigh')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-weigh" class="form-control" name="row[weigh]" type="number" value="{$row.weigh|htmlentities}">
        </div>
    </div> 
    </div>
    <div class="form-group layer-footer">
        <label class="control-label col-xs-12 col-sm-2"></label>
        <div class="col-xs-12 col-sm-8">
            <button type="submit" class="btn btn-primary btn-embossed disabled">{:__('OK')}</button>
        </div>
    </div>
</form>
